<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="icon" href="../img/微信图片_20250617181003.jpg" type="image/jpg">
		<link rel="stylesheet" type="text/css" href="../css/main.css" />
		<title>Cult电影首页</title>
		<style>
			
			.main {
				width: 92%;
				height: 1670px;
				background-color: white;
				display: flex;
				padding: 130px 0 0 8%;
			}

			.left {
				width: 65%;
			}

			.left1 {
				display: flex;
				width: 780px;
				color: #ff0000;
				justify-content: space-between;< !--两边对齐-->
				align-items: flex-end;< !--底对齐-->
				
			}

			.left1_1 {
				font-size: 35px;
				font-weight: bold;
			}

			.left1_2 {
				color: #ff0000;
				font-size: 17px;
			}

			.left1_2:hover {
				text-decoration: underline;
			}

			.left2 {
				display: flex;
				gap: 20px;
				margin-top: 20px;
			}

			.left2_img {
				width: 180px;
				border-radius: 10px;
				display: block;
			}

			.left2_1 {
				width: 180px;
				height: 40px;
				font-size: 18px;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.left2_1:hover {
				color: white;
				background-color: red;
			}

			.left3 {
				display: flex;
				flex-direction: column;
				width:780px;
				color: blue;
				justify-content: space-between;< !--两边对齐-->
				align-items: flex-end;< !--底对齐-->
				margin-top:30px ;
				margin-bottom: 20px;
				
				
			}
			
			.left3_1 {
				font-size: 35px;
				font-weight: bold;
				margin-left: 200px;		
			}
						
			.left3_2 {
				color: blue;
				font-size: 17px;
				margin-left: 1000px;
			}
						
			.left3_2:hover {
				xtext-decoration: underline;
			}
			
			.left4

			.right {
				width: 35%;
				
			}
			
			.right1 {
				font-size: 35px;
				font-weight: bold;
				color: red;
				margin-bottom: 20px;
			}
			
			.right2{
				display: flex;
				width: 450;
				padding-right: 50px;
				justify-content: space-between;
				align-items: center;
				border: 1px solid #c8c8c8;
				border-radius: 5px;
				margin-bottom: 50px;
				margin-right: 70px;
			}
			
			.right2_1{
				display: flex;
				align-items: center;
			}
			
			.right2_2{
				color: red;
				font-size: 16px;
			}
			
			.right2_1_1{
				margin-right: 5px;
				height: 60px;
			}
			
			.right3{
				display: flex;
				justify-content: space-between;
				width: 450;
				padding-right: 50px;
				margin-right: 55px;
				font-size: 16px;
				margin-bottom: 50px;
			}
			
			.right3_2{
				color: red;
				margin-right: 15px;
			}
			
			.right4{
				margin: 20px 0 30px 0; 
			}
			
			.right5{
				display: flex;
				width: 450;
				justify-content: space-between;
				align-items: center;
				/*border: 1px solid #c8c8c8;*/
				border-radius: 5px;
				margin-bottom: 50px;
				margin-right: 70px;
			}
			
            .right5_1_1{
				argin-right: 5px;
				height: 60px;
				margin-right: 15px;
			}
			
			.right6{
				line-height: 60px;
				padding-left: 19px;
				margin-top: 5px;
			}

			
		</style>
	</head>
	<body>
		<div class="header">
			<img class="header_img" src="../img/微信图片_20250617181003.jpg" alt="logo" />
			<div class="header1 header2">首页</div>
			<a class="header1_a" href="film.html">
				<div class="header1">电影</div>
			</a>
			<a class="header1_a" href="yingyuan.html">
				<div class="header1">影院</div>
			</a>
			<input class="header3" type="text" placeholder="搜索电影和影院" />
			<input class="header4" type="submit" value="搜索" />
			<a href="login.html"><input class="header5" type="button" value="登录" /></a><!---->
		</div>
		<div class="main">
			<div class="left">
				<div class="left1">
					<div class="left1_1">怀旧经典(150部)</div>
					<div><a class="left1_2" href="#">全部</a>&gt;</div>
				</div>

				<div class="left2">
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071457.jpg" alt="1.jpg" />
						</div>
						<div class="left2_1">月光光心慌慌</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071437.jpg" alt="2.jpg" />
						</div>
						<div class="left2_1">闪灵</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071425.jpg" alt="3.jpg" />
						</div>
						<div class="left2_1">着魔</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071400.jpg" alt="4.jpg" />
						</div>
						<div class="left2_1">养鬼吃人</div>
					</div>
				</div>

				<div class="left2">
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071234.jpg" alt="5.jpg" />
						</div>
						<div class="left2_1">洛基恐怖秀</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071310.jpg" alt="6.jpg" />
						</div>
						<div class="left2_1">发条橙</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071356.jpg" alt="7.jpg" />
						</div>
						<div class="left2_1">怪形</div>
					</div>
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071328.jpg" alt="8.jpg" />
						</div>
						<div class="left2_1">索多玛的120天</div>
					</div>
				</div>
				<div class="left3">
					<div class="left3_1">近期热映(50部)</div>
					<div><a class="left3_2" href="#">全部</a>&gt;</div>
				</div>
				
				<div class="left4">
					<div>
						<div>
							<img class="left2_img" src="../img/微信图片_20250618071213.jpg" alt="9.jpg" />
						</div>
						<a href="film_detail.html"><div class="left2_1">某种物质</div></a>
					</div>
			    </div>
				<div>
					<div>
						<img class="left2_img" src="../img/微信图片_20250618071250.jpg" alt="10.jpg" />
					</div>
					<div class="left2_1">仲夏夜惊魂</div>
				</div>
				
				<div>
					
				</div>
			</div>   


			<div class="right">
				<div class="right1">今日票房</div>
				<div class="right2">
					<div class="right2_1">
						<input  class="right2_1_1" type="image" src="../img/dc0fbab069f942bd0ab211f51ad625b.jpg"/ alt="aaa.jpg">某种物质
					</div>
					<div class="right2_2">82.5万</div>
				</div>
				
				<div class="right3">
					<div class="right3_1">
						<span class="right3_2">2</span>异形：夺命舰
					</div>
					<div class="right3_2">75.5万</div>
				</div>
				
				<div class="right3">
					<div class="right3_1">
						<span class="right3_2">3</span>遗传厄运
					</div>
					<div class="right3_2">45.5万</div>
				</div>
				
				<div class="right3">
					<div class="right3_1">
						<span class="right3_2">4</span>女巫
					</div>
					<div class="right3_2">20.5万</div>
				</div>
				
				<div class="right3">
					<div class="right3_1">
						<span class="right3_2">5</span>灯塔
					</div>
					<div class="right3_2">15.5万</div>
				</div>
				
				<div class="right3">
					<div class="right3_1">
						<span class="right3_2">6</span>林中小屋
					</div>
					<div class="right3_2">6.5万</div>
				</div>
				
				<hr  class="right4" width="80%" align="left"/>
				
				<div class="right1">热门影星</div>
				<div class="right5">
					<img class="right5_1_1" src="../img/522b93873935896f8834a21c9cd4a3a.jpg" alt="bbb.jpg" />伊莎贝尔·阿佳妮
				</div>
				<ol class="right6" start="2">
					<li>米娅·高斯</li>
					<li>黛米·摩尔</li>
					<li>乌玛·瑟曼</li>
					<li>杰克·尼科尔森</li>
					<li>布拉德·皮特</li>
					<li>娜奥米·沃茨</li>
					
				</ol>
				
			</div>
		</div>
		<div class="footer">
			<div class="footer1">
			<p class="footer2">友情链接：&nbsp;&nbsp;
			<a class="footer2_1" href="#">美团网&nbsp;|&nbsp;</a>
			<a class="footer2_1" href="#">猫眼电影&nbsp;|&nbsp;</a>
			<a class="footer2_1" href="#">饿了吗&nbsp;|&nbsp;</a>
			<a class="footer2_1" href="#">百度</a>
			</p>	
			<p class="footer2">商务合作邮箱：3892260010@qq.com <span class="footer2_3">客服电话：12345667</span></p>
			<p class="footer2">违法和不良信息/涉未成年人有害信息举报电话：12344567</p>
			<p class="footer2">用户举报/涉未成年人有害信息举报邮箱：3458907843@qq.com</p>
			<p class="footer2">诈骗检举邮箱：3458907843@qq.com</p>
			<p class="footer2">中华人民共和国营业性演出许可证：35261773号</p>
			<p class="footer2">广播电视节目制作经营许可证555555555号|网络文化经营许可证：333333333号</p>
			<p class="footer2_2">本网页是为了递交学校老师的项目作业，纯属虚构，如有雷同，纯属巧合。</p>
			</div>
		</div>
	</body>
</html>